
 // 获取 浏览器地址栏数据 获取结果是一个对象
 const urlValObj = myGetUrlValObj();
 console.log(urlValObj);

 let cat_one_id = urlValObj.cat_one_id;
 console.log(cat_one_id);

 // 定义变量 存储当前页面 相关信息
 // 当前显示 页数 默认值 是1
 let page = 1;
 // 当前显示 数据数量 根据实际项目需求设定 目前设定为4
 let line = 4;

 // 2, 调用 async 声明的函数 通过 await 调用
 setPage();

 /*
 async 可以 直接 调用全局变量
 async 定义 在函数中 也不能调用函数中的 变量/形参


 */

 async function setPage() {
   // 根据 一级分类名称 当前页数 每页显示数据数量 向数据库发送请求
   const res = await myPromiseJQueryAjax(
     "../server/goods_list.php",
     "get",
     { cat_one_id, page, line },
     "json"
   );
   console.log(res);

   // 创建一个ul标签对象
   const oUl = document.createElement("ul");

   // 清空标签内容
   $(".container").html("");

   // 定义变量存储生成的字符串.
   let str = "";

   // 循环 数组 生成 li标签
   res.data.forEach((item) => {
     // item 是 数组中存储数据的对象
     str += `
     <li class="list-item">
     <div class="panel panel-primary">
       <div class="panel-body">
         <ol class="breadcrumb">
           <li><a href="#">${item.cat_one_id}</a></li>
           <li><a href="#">${item.cat_two_id}</a></li>
           <li class="active">${item.cat_three_id}</li>
         </ol>
       </div>
       <div class="panel-footer">
         <div class="row">
           <div class="">
             <div class="thumbnail">
               <img src="${item.goods_big_logo}" alt="...">
               <div class="caption">
                 <h3>${item.goods_name}</h3>
                 <p>
                   <i class="glyphicon glyphicon-yen"></i>
                   <span>${item.goods_price}</span>
                 </p>
                 <p><a href="javascript:;" class="btn btn-primary" role="button">查找相似商品</a> <a href="./detail.html?goods_id=${item.goods_id}" class="btn btn-danger" role="button">查看商品详情</a></p>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
   </li>
     `;
   });

   // 将 字符串内容写入 ul标签
   $(oUl).html(str);

   // 将 ul标签写入
   $(".container")[0].appendChild(oUl);

   $(".man").pagination({
     pageCount: res.sumPage, //总页数
     totalData: res.row, //数据总条数
     current: res.page, //当前第几页
     showData: res.line, //每页显示的条数
     prevCls: "prev", //上一页class
     nextCls: "next", //下一页class
     prevContent: "上一页", //上一页节点内容
     nextContent: "下一页", //下一页节点内容
     activeCls: "active", //	当前页选中状态class名
     mode: "fixed", //	模式，unfixed不固定页码按钮数量，fixed固定数量
     count: 4, //mode为unfixed时显示当前选中页前后页数，mode为fixed显示页码总数
     coping: true, //是否开启首页和末页，值为boolean
     isHide: false, //总页数为0或1时隐藏分页控件
     keepShowPN: false, //否一直显示上一页下一页,
     homePage: "首页", //首页节点内容，默认为空
     endPage: "末页", //尾页节点内容，默认为空
     jump: true, //是否开启跳转到指定页数，值为boolean类型
     callback: function (result) {
       //定义执行的回调函数 必须要定义一个形参 插件自动向形参存储数据

     page = result.getCurrent();
       setPage();
     },
   });
 }


